<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="app" uri="http://www.wanrenhui.com"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<%@include file="/res/include/base-head.jsp"%>
<%@include file="/res/include/jquery-easyui.jsp"%>
<script type="text/javascript" src="${pageContext.request.contextPath}/res/js/draw/drawItem.js"></script>
<style>
*{margin:0; padding:0;}
.box{ position:absolute; padding:10px 20px 20px 20px; background:#fff; z-index:999999;}
.box dl{display:block; width:100%;margin-bottom:50px;}
.box dt{font-size:14px;color:red;line-height:30px; font-weight:bold;}
.box dd{ width:49%;float:left; line-height:30px; }

table.gridtable {
	font-family: verdana,arial,sans-serif;
	font-size:11px;
	color:#333333;
	border-width: 1px;
	border-color: #666666;
	border-collapse: collapse;
}
table.gridtable th {
	border-width: 1px;
	padding: 8px;
	border-style: solid;
	border-color: #666666;
	background-color: #dedede;
}
table.gridtable td {
	border-width: 1px;
	padding: 8px;
	border-style: solid;
	border-color: #666666;
	background-color: #ffffff;
}
</style>
</head>
<body>
<form id="data-form">
	<div class="form_item">
		<dl>
			<dt>抽奖活动名称：</dt>
			<dd>
				<input  type="text" id="name" name="name"/>
			</dd>
		</dl>
		<dl>
			<dt>描述：</dt>
			<dd>
				<textarea class="txt grid-75" id="remark" name="remark" oninput="admin.drawBase.netMsgChange('remark',360)" onpropertychange="admin.drawBase.netMsgChange('remark',360)" rows="4" ></textarea>
			</dd>
		</dl>
		<dl>
        <dt>开始时间：</dt>
	       <dd>
	       		<input id="startAt" type="text" class="txt easyui-datetimebox grid-15" name="startAt" data-options="required:true,validType:'datetime'" />
	       </dd>
    	</dl>
   		<dl>
        <dt>结束时间：</dt>
        <dd>
        	<input id="endAt" type="text" class="txt easyui-datetimebox grid-15" name="endAt" data-options="required:true,validType:'datetime'" />
        </dd>
    	</dl>
	    <dl>
	        <dt>线下商品过期领取时间：</dt>
	        <dd>
	        	<input id="expireAt" type="text" class="txt easyui-datetimebox grid-15" name="expireAt" data-options="required:true,validType:'datetime'" />
	        </dd>
	    </dl>
	    <dl>
			<dt>抽奖类型：</dt>
			<dd>
				<select name="type">
				<option value="3">其他</option>
				<option value="2">圈子</option>
				<option value="1">社区</option>
				</select>
			</dd>
		</dl>
		<dl>
			<dt>适用范围：</dt>
			<dd>
				<select name="rangeType" id="rangeType">
					<option value="1">平台(通用)</option>
					<option value="2">社区</option>
				</select>
			</dd>
		</dl>
		<dl style="display:none;" id="showCommunity">
			<dt>社区：</dt>
			<dd>
			<div>
				<select name="communityId" id="communityId">
					<c:forEach var="item" items="${communityList}">
						<option value="${item.id}">${item.name}</option>
					</c:forEach>
				</select>
			</div>
			
			</dd>
		</dl>
    	<dl>
			<dt>奖品列表：</dt>
			<dd>
				<table class="gridtable" style="width: 50%;">
	                <thead>
	                <tr>
	                    <th>名称</th>
	                    <th>图片</th>
	                    <th>数量</th>
	                    <th>中奖率(1-1000以内)</th>
	                </tr>
	                </thead>
	                <tbody>
	                <c:forEach var="item" items="${drawItems}">
	                    <tr>
	                        <td>${item.name}</td>
	                        <td><img src="${item.pathImgs}" alt="" height="60" width="60" /><input type="hidden" name="drawItemIds" value="${item.id}"/></td>
	                        <td><input type="text" name="quantitys" value="${item.quantity}"/></td>
	                        <td><input type="text" name="rates" value=""/></td>
	                    </tr>
	                </c:forEach>
	                </tbody>
	            </table>
			</dd>
		</dl>
		<p class="page_btn"><input type="button" id="saveBtn" value="保存" class="btn_blue" onclick="add();"/></p>
	</div>
</form>
<script type="text/javascript">
function add(){
	var quantitysNull=0;
	$('input[name="quantitys"]').each(function(){
		if(""==$(this).val()){
			quantitysNull++;
		}
	  });
	if(quantitysNull>0){
		top.showInfo('请输入奖品数量');
		 return;
	}
	var ratesNull=0;
	$('input[name="rates"]').each(function(){
		if(""==$(this).val()){
			ratesNull++;
		}
	  });
	if(ratesNull>0){
		top.showInfo('请输入奖品中奖率');
		 return;
	}
	var rate=0;
	$('input[name="rates"]').each(function(){
		rate=rate+parseInt($(this).val());
	  });
	if(rate!=1000){
		top.showInfo('奖品中奖率总和必须1000');
		return;
	}
	if($("#rangeType").val()==2){
		var communityId=$("#communityId").val();
		if(null==communityId||''==communityId){
			top.showInfo('请选择抽奖社区');
			return;
		}
	}
	
	var data = $('#data-form').form('jsonObject');
	var url = contextPath + '/draw/base/add';
	var drawItemIds=[];
	$('input[name="drawItemIds"]').each(function(){
		drawItemIds.push($(this).val());
	  });
	data.drawItemIds=drawItemIds.join(";");
	var rates=[];
	$('input[name="rates"]').each(function(){
		rates.push($(this).val());
	  });
	data.rates=rates.join(";");
	var quantitys=[];
	$('input[name="quantitys"]').each(function(){
		quantitys.push($(this).val());
	  });
	data.quantitys=quantitys.join(";");
	 $.post(url, data, function(result) {
		if (result.code == 1) {
		 	top.addTab("",'抽奖列表', contextPath+'/draw/base/list');
		} else {
			top.showInfo(result.msg);
		}
		
	});
}

$("#rangeType").change(function(){
	  if(this.value==2){
		  $("#showCommunity").show();
	  }else if(this.value==1){
		  $("#showCommunity").hide();
	  }
});
</script>
</body>
</html>
